<template>
  <div class="app-container" v-loading="pageLoading">
    <div class="filter-container">
      <el-input style="width: 260px" placeholder="输入工单号按回车" clearable class="filter-item" @keyup.enter.native="research"
        @clear="research" v-model="queryString">
        <template slot="prepend">工单号</template>
      </el-input>
      <el-button class="filter-item" type="success" plain @click="research">查询</el-button>
    </div>
    <el-tabs v-model="currentTab" @tab-click="tabClick">
      <el-tab-pane label="基本信息" name="tab1">
        <tab-1 :mo_no="mo_no" @after-getmo="update"></tab-1>
      </el-tab-pane>
      <el-tab-pane label="序号清单" name="tab2">
        <tab-2 :mo_no="mo_no"></tab-2>
      </el-tab-pane>
      <el-tab-pane label="工艺流程" name="tab3">
        <tab-3 ref="tab3" :routeId="route_id"></tab-3>
      </el-tab-pane>
      <el-tab-pane label="BOM表" name="tab4">
        <tab-4 :mo_no="mo_no"></tab-4>
      </el-tab-pane>
      <el-tab-pane label="物料采集记录" name="tab5">
        <tab-5 :mo_no="mo_no"></tab-5>
      </el-tab-pane>
      <el-tab-pane label="在制品信息" name="tab6">
        <tab-6 :mo_no="mo_no"></tab-6>
      </el-tab-pane>
      <el-tab-pane label="投入产出详情" name="tab7">
        <tab-7 :mo_no="mo_no"></tab-7>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import commonMixin from '@/views/_common/mixin'
import tab1 from '@/views/components/moManageInfo/tab1'
import tab2 from '@/views/components/moManageInfo/tab2'
import tab3 from '@/views/components/moManageInfo/tab3'
import tab4 from '@/views/components/moManageInfo/tab4'
import tab5 from '@/views/components/moManageInfo/tab5'
import tab6 from '@/views/components/moManageInfo/tab6'
import tab7 from '@/views/components/moManageInfo/tab7'
export default {
  mixins: [commonMixin],
  name: 'moManageInfo',
  components: { tab1, tab2, tab3, tab4, tab5, tab6, tab7 },
  data() {
    return {
      queryString: null,
      currentTab: 'tab1',
      bom_id: null,
      mo_no: null,
      route_id: null,
    }
  },
  methods: {
    tabClick(tab) {
      if (tab.name == 'tab3') {
        this.$refs.tab3.refresh()
      }
    },
    research() {
      //  搜索条件变化处理
      this.currentTab = 'tab1'
      this.mo_no = this.queryString
    },
    update({ bom_id, route_id }) {
      this.bom_id = bom_id
      this.route_id = route_id
    },
  },
  created: function () {
    if (this.$route.params && this.$route.params.id) {
      this.queryString = this.$route.params.id
    }
    this.mo_no = this.queryString
  },
}
</script>

<style scoped>
</style>
